<!DOCTYPE HTML>
<html lang="zh-cn">
  <head>
    <meta charset="UTF-8">
    <title>Powerful JQuery Plugins</title>
    <link rel="icon" href="http://dict.cn/favicon.ico" type="/image/x-icon" />
    <link rel="shortcut icon" href="http://dict.cn/favicon.ico" type="/image/x-icon" />
    <link href="/js/primeUI/ui-lightness/theme.css" type="text/css" rel="stylesheet"></link>
    <link href="/js/jQueryUI/jquery-ui.css" type="text/css" rel="stylesheet"></link>
    <link href="/js/fontAwesome/font-awesome-4.3.0/css/font-awesome.min.css" type="text/css" rel="stylesheet"></link>
    <link href="/js/primeUI/primeui-2.0-min.css" type="text/css" rel="stylesheet"></link>
    <link href="/js/jQueryScrollbar/perfect-scrollbar.css" type="text/css" rel="stylesheet"></link>
    <style type="text/css">
        body {
            min-width: 800px;
        }
        #panel {
            width: 150px;
            height: 50px;
        }
    </style>
  </head>
  
  <body>
    <div id="dlg" title="弹出框">
        <div id="panel">
                    测试PrimeUI
        </div>
    </div>
    <ul id="ctx">
        <li>
            <a data-icon="fa fa-gear fa-fw">工具</a>
        </li>
        <li>
            <a data-icon="fa fa-plus fa-fw">添加</a>
        </li>
        <li>
            <a data-icon="fa fa-trash fa-fw">删除</a>        
        </li>
        <li>
            <a data-icon="fa fa-edit fa-fw">修改</a>
        </li>
    </ul>
    <script src="/js/jQuery/jquery-1.11.3.js" type="text/javascript"></script>
    <script src="/js/jQueryValidation/jquery.validate.js" type="text/javascript"></script>
    <script src="/js/jQueryValidation/messages_zh.js" type="text/javascript"></script>
    <script src="/js/jQueryValidation/additional-methods.js" type="text/javascript"></script>
    <script src="/js/jQueryScrollbar/perfect-scrollbar.jquery.js" type="text/javascript"></script>
    <script src="/js/jQueryUI/jquery-ui.js" type="text/javascript"></script>
    <script src="/js/primeUI/primeui-2.0-min.js" type="text/javascript"></script>
    <script type="text/javascript">
        $(function() {
            $("#panel").puipanel({
                toggleable: true,
                closable: true
            });
            $("#dlg").puidialog({
                width: 300,
                height: 200,
                minWidth: 200,
                minHeight: 150,
                showEffect: "fade",
                hideEffect: "fade",
                minimizable: true,
                maximizable: true,
                visible: true
            });
            $("#ctx").puicontextmenu({
                target: $("#dlg")
            });
        });
    </script>
  </body>
</html>